/* eslint-disable */
import { List } from 'antd';
const blogInfoModules = require.context('../_mdx', true, /^\.\/([^/]+\/)?info\.(js|ts)$/);

let blogInfos = [];
blogInfoModules.keys().forEach((key) => {
  const module = blogInfoModules(key);
  blogInfos.push(module.default);
});
const blogComponentModules = require.context('../_mdx', true, /^\.\/([^/]+\/)?page\.mdx$/);

const blogComponents = [];
const blogPaths = [];

blogComponentModules.keys().forEach((key) => {
  const mdxName = key.split('/')[1];
  const module = blogComponentModules(key);
  blogComponents.push(module.default);
  blogPaths.push(`/blogs/${mdxName}`);
});

blogInfos = blogInfos.map((info, index) => {
  return {
    ...info,
    component: blogComponents[index],
    path: blogPaths[index],
  };
});
export { blogInfos };

export default function BlogMenu() {
  return (
    <>
      <List
        header={<div>Header</div>}
        footer={<div>Footer</div>}
        bordered
        dataSource={blogInfos}
        renderItem={(item) => {
          return (
            <List.Item>
              <a href={item.path} key={item.path}>
                {' '}
                {item.title}
              </a>
            </List.Item>
          );
        }}
      />
    </>
  );
}
